"use client";

import { useEffect, useState } from "react";
import "./index.css";
import { getQuestionVoByIdUsingGet } from "@/api/questionController";
import QuestionCard from "@/components/QuestionCard";
import { useRouter } from "next/navigation";
import { message } from "antd";

export default function Question({ params }) {
  const { questionId } = params;
  const [question, setQuestion] = useState(undefined);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);
  const router = useRouter();

  useEffect(() => {
    // 查询题目信息
    const fetchData = async () => {
      try {
        const res = await getQuestionVoByIdUsingGet({
          id: questionId,
        });
        setQuestion(res.data);
      } catch (e) {
        setError(e);
      } finally {
        setLoading(false);
      }
    };

    fetchData();
  }, [questionId]);

  if (loading) {
    return <div className="limit-min-height">加载中...</div>;
  }

  if (error || !question) {
    if (error) {
      message.info("请登陆后查看题目");
      router.push("/user/login");
      return;
    }
    return <div className="limit-min-height">查询失败</div>;
  }

  return (
    <div id="question" className="limit-min-height">
      <QuestionCard question={question} />
    </div>
  );
}
